/**
 * @description 表格弹窗
 * @param {}
 * @description 双击会选中双击的那条数据并执行确定事件，然后关闭Modal
 * 使用说明：父组件中引用此组件。在父组件中某个地方调用本组件暴露出去的initModal方法，
 * 方法传入以下一些配置：listViewProps:{menuCode,isInitSearch,upDoubleClick函数，此函数是重点，可以接收到表格内容的双击的回调，在回调中再调用一下暴露的onCancel方法即可关闭此弹窗},
 */
import React, { useState, useImperativeHandle, useRef, useEffect } from "react";
import { Modal } from "antd";



const XxTableModal = ({ onRef }) => {
    const [modalProps, setModalProps] = useState({
        title: "表格Modal组件"
    });
    const [show, setShow] = useState(false);
    const [ListViewProps, setListViewProps] = useState({});
    const initModal = ({
        show = true,
        listViewProps = Object,
        modalProps = Object
    }) => {
        setShow(show);
        setListViewProps(listViewProps);
        setModalProps(modalProps);
    }

    // 取消关闭 重置
    const onCancel = () => {
        setShow(false);
        setListViewProps({});
        setModalProps({ title: "表格Modal组件" });
    }

    useImperativeHandle(onRef, () => ({
        initModal,
        onCancel: onCancel

    }))

    // onOk事件
    const onOk = () => {

    }

    return <>
        <Modal
            open={show}
            destroyOnClose={true}
            centered={true}
            width={1000}
            title={modalProps.title}
            onCancel={() => initModal({ record: {}, show: false })}
            onOk={onOk}
            footer={false}
            closable={true}
            styles={{
                body: {
                    height: 600
                }
            }}
            {...modalProps}
        >
            {/* <ListView
                // upDoubleClick={modalOnDoubleClick}
                isInitSerch={true}
                checkType="radio" //选择类型 单选
                {...ListViewProps}
            /> */}

        </Modal>
    </>
}

export default XxTableModal;